<template>
  <div>
    <FireOutlined v-if="icon === 'FireOutlined'" />
    <ClockCircleOutlined v-if="icon === 'ClockCircleOutlined'" />
    <EditOutlined v-if="icon === 'EditOutlined'" />
    <PictureOutlined v-if="icon === 'PictureOutlined'" />
    <VideoCameraOutlined v-if="icon === 'VideoCameraOutlined'" />
    <FileTextOutlined v-if="icon === 'FileTextOutlined'" />
    <RobotOutlined v-if="icon === 'RobotOutlined'" />
    <MessageOutlined v-if="icon === 'MessageOutlined'" />
    <CodeOutlined v-if="icon === 'CodeOutlined'" />
    <BulbOutlined v-if="icon === 'BulbOutlined'" />
    <AudioOutlined v-if="icon === 'AudioOutlined'" />
    <SearchOutlined v-if="icon === 'SearchOutlined'" />
    <CloudOutlined v-if="icon === 'CloudOutlined'" />
    <BookOutlined v-if="icon === 'BookOutlined'" />
    <ApiOutlined v-if="icon === 'ApiOutlined'" />
    <BarChartOutlined v-if="icon === 'BarChartOutlined'" />
    <EyeOutlined v-if="icon === 'EyeOutlined'" />
    <ThunderboltOutlined v-if="icon === 'ThunderboltOutlined'" />
  </div>
</template>
<script setup lang="ts">
/**
 * Ant Design图标组件
 * 根据传入的图标名称动态渲染对应的Ant Design图标
 * 支持多种图标类型的条件渲染
 */

/**
 * 组件属性定义
 * @property {string} icon - 图标名称，用于确定渲染哪个图标
 */
defineProps<{ icon: string }>();
</script>
